<template>
   <head-bar class="box animated  fadeInDown">
      <head-bar-item path="/home">
        <div slot="item-text">首页</div>
      </head-bar-item>
      <head-bar-item path="/category">
        <div slot="item-text">分类1</div>
      </head-bar-item>
      <head-bar-item path="/cart">  
        <div slot="item-text">分类2</div>
      </head-bar-item>
      <head-bar-item path="/profile">
        <div slot="item-text">分类3</div>
      </head-bar-item>
    </head-bar>
</template>

<script>
import HeadBar from "./headbar/HeadBar";
import HeadBarItem from "./headbar/HeadBarItem";
export default {
  name:'MainHeadBar',
  data() {
  return {}
  },
  methods: {

  },
  components: {
    HeadBar,
    HeadBarItem
  }
}
</script>

<style scoped>
</style>